{% extends "auth.html" %}
{% block regular_content %}
<div class="flex flex-col">
    <h1 class="md:px-16 ">{{ _('create_class') }}</h1>
    <form id="create_class_form" onsubmit="hedyApp.create_class_redesign(this); event.preventDefault();">
        <div class="flex flex-col px-8 md:mx-16 my-5 w-full md:w-3/4 bg-white border border-gray-400 shadow-md rounded-lg py-8">
            <div class="flex flex-col gap-5 mx-2 mb-10">
                <div class="flex flex-row gap-20 items-center mb-10" >
                    <label for="class_name" class="text-xl">{{ _('class_name') }}</label>
                    <input type="text" id="class_name" name="class_name" class="border border-gray-300 rounded-lg p-2 w-2/3" required>
                </div>
                <div class="flex flex-row gap-10 mb-5">
                    <div>
                        <input type="radio" name="creation_type" required value="standard">
                    </div>
                    <div class="flex flex-col gap-2">
                        <label for="submitted" class="text-xl">{{ _('standard_new_class') }}</label>
                        <p class="mt-0">{{ _('standard_new_class_explanation') }}</p>
                    </div>
                </div>
                <div class="flex flex-row gap-10 mb-5">
                    <div>
                        <input type="radio" name="creation_type" required value="copy">
                    </div>
                    <div class="flex flex-col gap-2">
                        <label for="submitted" class="text-xl">{{ _('copy_class') }}</label>
                        <p class="mt-0">{{ _('copy_class_explanation') }}</p>
                        {% if not teacher_classes %}
                            <p>{{ _('no_existing_class') }}</p>
                        {% else %}
                            <div class="flex flex-row">
                                <span class="">{{ _('class')  }}</span>
                                <select class="ml-2 border border-gray-300 rounded-lg p-1 w-1/2" name="class_to_copy" id="class_to_copy">
                                    {% for class in teacher_classes %}
                                        <option value="{{ class.id }}">{{ class.name|e }}</option>
                                    {% endfor %}
                                </select>
                            </div>
                            <div class="flex flex-row items-center gap-2">
                                <label class="switch">
                                    <input id="copy_second_teachers" type="checkbox">
                                    <span class="slider round"></span>
                                </label>
                                <label for="copy_second_teachers"> {{ _('copy_second_teachers') }}</label>
                            </div>
                        {% endif %}
                    </div>
                </div>
                <div class="flex flex-row gap-10 mb-5">
                    <div>
                        <input type="radio" name="creation_type" required value="plain">
                    </div>
                    <div class="flex flex-col gap-2">
                        <label for="submitted" class="text-xl">{{ _('class_without_adventures') }}</label>
                        <p class="mt-0">{{ _('class_without_adventures_explanation') }}</p>
                    </div>
                </div>
            </div>
            <button class="green-btn-new w-fit" >{{_('ok')}}</button>
        </div>
    </form>
</div>
{% endblock %}